<template>
  <div class="exhibitionDetail" v-for="item in exhibitionList" :key="item">

      <div>
        <div>
          <div class="swiper-image">
            <img :src="item.cover">
          </div>
        </div>
        <div>
          <div >
            <h2>{{item.name}}</h2>
          </div>

          <div class="text_info_top">
            <span class="time">
              <el-icon style="vertical-align:middle;margin-right: 1px;margin-bottom: 3px"><Clock /></el-icon>
              时间:
              <em>{{item.startTime}}至{{item.endTime}}</em>
            </span>

            <span class="address">
              <el-icon style="vertical-align:middle;margin-right: 1px;margin-bottom: 3px"><Location /></el-icon>
              地址:
              <em>{{item.location}}</em>
            </span>
          </div>
          <div class="text-info">
            <p>{{item.detail}}</p>
          </div>
        </div>

<!--        <el-footer>Footer</el-footer>-->
      </div>

  </div>
</template>

<script>
import request from "../../../../front_admin/src/utils/request";
import Cookies from "js-cookie";
import { Location,Clock} from '@element-plus/icons-vue'
export default {
  name: "ExhibitionDetail",
  components:{
    Location,
    Clock,
  },
  data(){
    return{
      exhibitionList:[],

    }
  },
  created() {
    this.load()
  },
  methods:{
    load(){
      const id = this.$route.query.id
      request.get("/exhibition/"+ id).then(res => {
        if(res.code === '200') {
          //push 将对象放入数组
          // console.log("res.data",res.data)
          this.exhibitionList=[res.data]
          // console.log("commodities内容是",this.commodities.cover)
        }
      })
    }
  }
}
</script>

<style scoped lang="less">
.el-container{
  width:85%;
  margin:15px auto;
}
.swiper-image{
  img{
    width: 75%;
    max-height: 420px;
  }
}
.time{
  margin-right: 15px;
}
.text-info{
  width: 72%;
  margin: 15px auto;
}
</style>